<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="../../include/taglib.jsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<%@include file="../../include/inhead.jsp"%>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet"
	href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">

<!-- 可选的Bootstrap主题文件（一般不用引入） -->
<link rel="stylesheet"
	href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<title>车辆保养--E爱车</title>

    <script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript">
       </script>
	<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
<%@include file="../../include/iswechat.jsp" %>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
			<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
			<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->
<style>
body {
	color: #444;;
	background-color: #eee;
}

a {
	text-decoration: none
}

.navbar-eaiche {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
}

.tile {
	border: 1px solid #ccc;
	background-color: #fff;
	height: 150px;
	line-height: 150px;
	margin-top: 20px;
	text-align: center;
	padding: 0px;
	border-radius: 5px;
}

.tile img {
	width: 40%;
}

/*********************城市选择列表*********************/
.city-list {
	margin: 20px 0 10px 0;
	padding-left: 10px;
}

.city-list .city-caption {
	height: 30px;
	line-height: 30px;
	border-bottom: 2px solid #ccc;
	margin-bottom: 5px;
	font-size: 18px;
}

.sub-city-box {
	margin-left: 10px;
}

.btn {
	margin-bottom: 5px;
}
/*********************城市选择列表*********************/
</style>
</head>
<body>
	<input type="hidden" id="areaid"
		value="402880ed4bed4f92014bed4f92d50000" />
	<!-- 导航开始 -->
	<nav class="navbar navbar-eaiche">
		<div class="container">
			<div style="float: left;">
				<img style="height: 55px;" src="${ctx }/static/images/logoe.png" />
			</div>
			<div style="float: right; text-align: center; line-height: 50px;">
				<img style="height: 30px; margin-top: 0px;"
					src="${ctx }/static/images/local.png" />&nbsp;&nbsp;<span>${city }</span>
			</div>
		</div>
	</nav>
	<!-- 导航结束 -->
	<!-- 功能块开始 -->
	<div class="container-fluid">
		<div class="row" id="clist">

	


		</div>
	</div>
	<!-- 功能块结束 -->
	<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
	<script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script
		src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

	<script type="text/javascript">
      var arid= $("#areaid").val();
     $(function(){
    	 var sthtml="";
    	 $.post("${ctx}/weixin/f/matenance/by/brand/cilist",
    			 function(data){
    		      if(data.success){
    		    	  if(data.rows!=null&& data.rows.length>0){
    		    		  for(var i=0;i<data.rows.length;i++){
    		    			  sthtml +='<div class="city-list">'
    		    				      +'<div class="city-caption">'
    		    			          +'<a href="javascript:zhan(\''+data.rows[i].id+'\')">'+data.rows[i].areaname+'</a>'
    		    			          +'</div>'
    		    			          +'<div class="sub-city-box" id="model'+data.rows[i].id+'">'
    		    			          +'</div>'
    		    			          +'</div>';
    							    
    		    		  }
    		    		  $("#clist").html(sthtml);
    		    	  }
    		      }
    	 },"json");
     });
     
     //展开
     function zhan(id){
    	 var zhtml="";
    	 $.post("${ctx}/weixin/f/matenance/by/brand/cilist",
    			 {id:id},
    			 function(data){
    		      if(data.success){
    		    	  if(data.rows!=null&& data.rows.length>0){
    		    		  for(var i=0;i<data.rows.length;i++){
    		    			 
    		    			 zhtml+='<button class="btn btn-default" onclick="setcity(\''+data.rows[i].id+'\');">'+data.rows[i].areaname+'</button>';
    							    
    		    		  }
    		    		  $(".sub-city-box").hide();
    		    		  $("#model"+id).html(zhtml);
    		    		  $("#model"+id).show();
    		    		
    		    	  }
    		      }
    	 },"json");
     }
     
     var setcity = function(id){
    	 $.post("${ctx}/weixin/f/matenance/by/brand/setcity"
    			 ,{cityid:id},function(data){
    				 if(data.success){
    					 window.location.href="${ctx}/weixin/f/matenance/by/brand";
    				 }else{
    					 alert("出现异常!请联系管理员");
    				 }
    			 },"json");
     }
     
    </script>
</body>
</html>

